<template>
  <van-image
    :round="round"
    :width="width"
    :height="height"
    :src="src"
    @click="handlePriview"
  />
</template>
<script lang="ts">
import {
  defineComponent,
  onBeforeMount,
  reactive,
  toRefs,
  watchEffect,
} from "vue";
import { showImagePreview } from "vant";

export default defineComponent({
  name: "chatImage",
  props: {
    src: {
      type: String,
      default: "",
    },
    height: {
      type: String,
      default: () => "",
    },
    width: {
      type: String,
      default: () => "defaultLimit",
    },
    round: {
      type: Boolean,
      default: () => false,
    },
  },
  setup(props, { emit }) {
    const state = reactive({
      attachList: [],
    });

    const handlePriview = () => {
      showImagePreview([props.src]);
    };

    return {
      ...toRefs(state),
      handlePriview,
    };
  },
});
</script>
